import { memo, useContext } from 'react';
import Activity from '@/components/KeepAliveOutlet/Activity';
import { TOutlet } from '@/components/KeepAliveOutlet/type';
import {OffScreenContext} from "@/components/KeepAliveOutlet/useActivity.ts";

function KeepAliveOutlet() {
	const { outlets, key } = useContext(OffScreenContext);
	return (
		<>
			{outlets?.map((o: TOutlet) => (
				<Activity key={o.key} mode={key === o.key ? 'visible' : 'hidden'}>
					{o.outlet}
				</Activity>
			))}
		</>
	);
}
export default memo(KeepAliveOutlet);
